﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>BLOG访客地域来源记录</title>
<script type="text/javascript">
//<![CDATA[

//当前页码
var page = 0;
//每页记录数
var pagesize = 500;
//记录的地址，注意改成真实的地图输出地址
var url = "http://localhost/google/Chapter04/4.2/output.php";

//更改Iframe里加载的页面
function change_src(){
  var src = url+"?page=" + page + "&pagesize=" +pagesize;
  window.frames["gmapframe"].document.location.replace(src)
}

//下一条信息
function next_rec(){
  page++;
  change_src()
}
 
//上一条信息
function prior_rec(){
  page--;
  change_src()
}

//]]>
</script>
</head>

<body style="text-align:center;">
<h1>BLOG访客地域来源记录</h1>
<p><iframe id="gmapframe" name="gmapframe" width="100%" height="420px" frameborder="0" scrolling="no" src="http://localhost/google/Chapter04/4.2/output.php"></iframe></p>
<p>
<input type="button" value="上一条信息" id="prior" name="prior" onclick="prior_rec()" />
<input type="button" value="下一条信息" id="next" name="next" onclick="next_rec()" />
<!--
注意在改变每页大小输入框里内容改变时，判断键入的是不是数字，若不是则忽略
这里用到了两个事件onkeyup和onbeforepaste，其中用正则表达式替换非数字的值
同时把重新加载改变每页大小后的第一页
-->
每页大小<input type="text" value="500" id="pagesize" name="pagesize" onkeyup="value=value.replace(/[^\d]/g,'');page = 0; pagesize = value; change_src()" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,'')); page = 0; pagesize = value; change_src()" />
</p>
</body>
</html>
